<template>
	<view>
		<!-- 头部标题 -->
		<view class="cu-bar bg-white">
			<view class="action sub-title">
				<text class="text-xl text-bold text-green">签到</text>
				<text class="bg-green"></text>
				<!-- last-child选择器-->
			</view>
		</view>
		<!-- 头部标题 end -->

		<!-- 签到 -->
		<view class="bg-white" style="width: 100vw;height: 150upx;display: flex;justify-content: center;align-items: center;">
			<text class="text-green" style="font-weight: 600;font-size: 40upx;" @click="QianDao">开始签到</text>
		</view>
		<!-- end -->

		<!-- 历史签到记录 -->
		<view class="bg-white" style="width: 100vw;padding: 20upx;">


			<view style="display: flex;justify-content: space-between;">

				<text style="font-weight: 550;">历史签到记录</text>
				<text class="text-green" style="font-weight: 550;">100%</text>

			</view>

			<view class="" style="width: 100%;height: 1upx;background:#AAAAAA;margin-top: 10upx;"></view>

			<!-- 历史内容区域 -->
			<view class="" v-for="(item,index) in CheckWorkdData" :key="index" style="margin-top: 5upx;">

				<view class="" style="margin-top: 10upx;width: 100%;">

					<view class="" style="display: flex;align-content: center;align-items: center;">

						<view class="" style="margin-right: 20upx;margin-top: 10upx;">
							<text style="font-weight: 550;font-size: 30upx;">{{item.createdAt}}</text>
						</view>

						<view>
							<text style="font-size: 30upx; font-weight: 550;">{{ getWeek(new Date(item.createdAt))}} 签到</text>
						</view>

					</view>

					<view class="" style="display:flex;justify-content: flex-end;margin-right: 20upx;">
						<text style="font-weight: 550;color: #AAAAAA;">已签到</text>
					</view>


					<view class=""></view>
					<text style="font-size: 25upx;color: #888888;font-weight: 550;">{{item.createdTime}}</text>
					<view class="" style="width: 100%;background: #000000;height: 1upx;margin-top: 15upx;"></view>
				</view>

			</view>

		</view>
		<!-- end -->


	</view>
</template>

<script>
	export default {
		data() {
			return {
				CheckWorkdData: '',
			}
		},
		onLoad() {

		},
		onShow() {
			this.getCheckWorkdData()
		},
		methods: {
			//根据时间判断星期几
			getWeek(timedat) {
				//timedat参数格式：   getWeek（new Date("2017-10-27" )）
				var week;
				if (timedat.getDay() == 0) week = "星期日";
				if (timedat.getDay() == 1) week = "星期一";
				if (timedat.getDay() == 2) week = "星期二";
				if (timedat.getDay() == 3) week = "星期三";
				if (timedat.getDay() == 4) week = "星期四";
				if (timedat.getDay() == 5) week = "星期五";
				if (timedat.getDay() == 6) week = "星期六";
				return week;
			},
			// 考勤数据
			getCheckWorkdData() {

				var classId = uni.getStorageSync('clazzId')
				var studentId = uni.getStorageSync('user_info').id
				var _this = this
				uni.showLoading({
					title: "数据加载中..."
				})
				uni.request({
					url: _this.api + "Qian/getAll",
					data: {
						uid: studentId,
						clazzId: classId
					},
					header: {
						"content-type": "application/x-www-form-urlencoded"
					},
					method: "POST",
					success: (res) => {
						uni.hideLoading();
						_this.CheckWorkdData = res.data.data;
						console.log(res.data.data)

					},
					fail: (err) => {
						uni.hideLoading();
						uni.showToast({
							title: "考勤数据获取失败！请稍后在试~~",
							duration: 1000,
							icon: "none"
						})
					}

				})
			},

			QianDao() {
				var _this = this;
				var id = uni.getStorageSync('user_info').id

				var clazzId = uni.getStorageSync('clazzId')


				console.log(clazzId)
				uni.request({
					url: _this.api + "Qian/student", //签到
					method: "POST",
					data: {
						uid: id,
						clazzId: clazzId
					},
					header: {
						"content-type": "application/x-www-form-urlencoded"
					},
					success: (res) => {

						if (res.data.code == "200") {
							uni.showToast({
								title: res.data.message,
								duration: 2000,
								icon: "none"
							})
						} else {
							uni.showToast({
								title: res.data.message,
								duration: 2000,
								icon: "none"
							})
						}


					},
					fail: (err) => {
						uni.showToast({
							title: "登陆失败请稍后在试！",
							icon: 'none',
							duration: 1000
						})
					}
				})

			}
		}
	}
</script>

<style>

</style>
